import Vue from 'vue'
import VueRouter from 'vue-router'
//引入组件
import About from '../pages/About'
import Home from '../pages/Home'
import News from '../pages/News'
import Message from '../pages/Message'
import Detail from '../pages/Detail'

Vue.use(VueRouter)
//创建并暴露一个路由器
const router =  new VueRouter({
    routes:[
        {
            path:'/about',
            component:About
        },
        {
            path:'/home',
            component:Home,
            children:[
                {
                    path:'news',
                    component:News
                },
                {
                    path:'message',
                    component:Message,
                    children:[
                        {
                            name:'detail',
                            //携带query参数
                            // path:'detail',
                            //携带parmas参数
                            path:'detail/:id/:title',
                            component:Detail,
                            //第一种写法：props值为对象，该对象中所有的key-value的组合最终都会通过props传给Detail组件
	                        // props:{a:900}

	                        //第二种写法：props值为布尔值，布尔值为true，则把路由收到的所有params参数通过props传给Detail组件
	                        // props:true
	                        
	                        //第三种写法：props值为函数，该函数返回的对象中每一组key-value都会通过props传给Detail组件
	                        props($route){
	                        	return {
	                        		id:$route.query.id,
	                        		title:$route.query.title
	                        	}
	                        }
                        }
                    ]
                }
            ]
        }
    ]
})

//全局前置路由守卫---初始化的时候被调用、每次路由切换之前调用
// router.beforeEach((to,from,next)=>{
//     console.log('前置路由守卫',to,from);
//     if(to.path === '/home/news' || to.path === '/home/message'){
//         if(localStorage.getItem('school') === 'atguigu'){
//             next()
//         }else{
//             alert('学校名称不对，无访问权限')
//         }
//     }else{
//         next()
//     }
// })
//全局后置路由守卫---初始化的时候被调用、每次路由切换之前调用
// router.afterEach((to,from)=>{
//     console.log('后置路由守卫',to,from);
//     document.title = to.meta.title || 'Vue测试'
// })
export default router